<?xml version='1.0' encoding='UTF-8' ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">



<style type="text/css">
    table.sample {
        border-width: 0px;
        border-spacing: 2px;
        border-style: outset;
        border-color: gray;
        border-collapse: collapse;
        background-color:  aliceblue;
    }
    table.sample th {
        border-width: 2px;
        padding: 3px;
        border-style: solid;
        border-color: gray;
        background-color: aliceblue;
        -moz-border-radius:  ;
    }
    table.sample td {
        border-width: 2px;
        padding: 3px;
        border-style: solid;
        border-color: gray;
        background-color: aliceblue;
        -moz-border-radius: ;
    }



</style>

<html xmlns="http://www.w3.org/1999/xhtml"  
      xmlns:h="http://java.sun.com/jsf/html"  
      xmlns:p="http://primefaces.prime.com.tr/ui"
      xmlns:f="http://java.sun.com/jsf/core">


    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
        <title>Browse Articles</title>
    </head>
    <h:body>
        <h:form id="articleForm" >
            <h:dataTable styleClass="sample" id="table" value="#{articleBean.articles}" var="art">
                <f:facet name="header">
                    <h:outputText value="My Articles" />
                </f:facet>
                <h:column>
                    <f:facet name="header">
                        <h:outputText value="Id" />
                    </f:facet>
                    <h:outputText value="#{art.id}" />
                </h:column>
                <p:selectOneRadio id="status" value="#{art.status}">
                    <f:selectItem id="ut1"   itemLabel="Draft" itemValue="Draft" />
                    <f:selectItem id="ut2"  itemLabel="Published" itemValue="Published" />
                </p:selectOneRadio>
                  

                <h:column>
                    <f:facet name="header">
                        <h:outputText value="Date of publication" />
                    </f:facet>
                    <h:outputText value="#{art.date}" />
                </h:column>
                <h:column>
                    <f:facet name="header">
                        <h:outputText value="Title" />
                    </f:facet>
                    <h:outputText value="#{art.title}" />
                </h:column>
                <h:column>
                    <f:facet name="header">
                        <h:outputText value="Image" />
                    </f:facet>
                    <h:outputText value="#{art.image}" />
                </h:column>
                <h:column>
                    <f:facet name="header">
                        <h:outputText value="Article Text" />
                    </f:facet>
                    <h:outputText value="#{art.articleBody}" />
                </h:column>
                <h:column>
                    <f:facet name="header">
                        <h:outputText value="Tag" />
                    </f:facet>
                    <h:outputText value="#{art.tag}" />
                </h:column>

            </h:dataTable>
            <br/>
            <h:commandButton  action="#{articleBean.retrieveArticles()}" value="Show articles"/>
            <h:commandButton  immediate="true" action="/registeredMember_Menu.jsp" value="Back to main Menu"></h:commandButton>

            <br/>
        </h:form>
    </h:body>
</html>
